@import "colors.scss";
.blog {
    position: relative;
    overflow: hidden;
    .carousel-inner {
        padding-inline: 10%;
        padding-block: 5%;
    }
    .carousel-indicators [data-bs-target] {
        border-radius:50% !important;
        width: 8px !important;
        height: 8px !important;
    }
    .carousel-indicators .active {
        border-radius: 13px !important;
        width: 30px !important;
    }
    .card-img-top {
        height: 248px;
        width: 100%;
    }
    .card {
        max-width: 424px;
        width: 100%;
        text-align: start;
    }
    .card:hover {
        box-shadow: 0 .5rem 1rem rgba(black, .15);
    }
    h1 {
        font-size: 48px;
        font-weight: 600;
        color: $main-text;
    }
    .text-out {
        font-size: 18px;
        color: $gray-400;
    }
    .p1 {
        font-size: 14px;
        color: $gray-400;
    }
    .p2 {
        font-size: 18px;
        font-weight: 500;
        color: $main-text;
    }
    .gradient-1 {
        background: radial-gradient(#DA4DF140 10%, #ffffff00 50%); 
        width: 870px; 
        height: 870px; 
        position: absolute; 
        left: -400px; 
        top: -40%; 
    }
    .gradient-2 {
        background: radial-gradient(#C4F5E970 10%, #ffffff00 50%); 
        width: 870px; 
        height: 870px; 
        position: absolute; 
        right: -400px; 
        top: -40%; 
    }
}